function clearDefault(el) {
  if (el.defaultValue==el.value) el.value = ""
}

// General globals
var channel = 'intl';

// zoom-related global variables
var bigWidth; //width of the zoom image
var smallWidth; // width of zoomed image
var bigHeight; // height of the zoom image
var bigX = 0; // zoom image x position
var bigY = 0; // zoom image y position

//ratio between the small and big images of the product
//hard-coded, we could work this out dynamically
var zoomRatio = 0.25;

//Used to define a custom area where the zooming functionality can occur.
var productImageMarginTop = 32;
var productImageMarginSides = 50;
var productImageMarginBottom = 20;

var zoomWindowBoxWidth = 0;
var zoomWindowBoxHeight = 0;
var smallHeight;
var bigBoxWidth;
var bigBoxHeight;
var factorY;
var factorX;
var easing = 0.22;
var zoomInterval = 0;
var mouseX = 0;
var mouseY = 0;
var sHeight;
var elements;
var scrollBorder;
var thumbsPos = new Array();
var thumbsPosDown = new Array();
var imgAmount;
var i = 0;
var g = 92*5;
var idc = 0;
var delay = 0;
var rollOverInetrval;
var hideInterval;
var str =  new String(window.location);
var zoomImageShown = false;
var nr;
var issueNumber;
var pageNumber;
var images;
var scrollHeight;
var isZoomOn = false;
var isVideoOn = false;
var videoHasBeenLoaded = false;

/* 设置 box 最大图*/
function initProductPage()
{
	sHeight = 92;
	document.body.onmousemove=setMouseCoords;
	elements = countElements("thumbnails-mask","img");
	scrollHeight = sHeight * elements ;
	//document.getElementById("thumbnails-loop").style.top = scrollHeight+'px';

	smallWidth = 230;
	smallHeight = 345;

	bigBoxWidth = document.getElementById('zoom-box').offsetWidth;
	bigBoxHeight = document.getElementById('zoom-box').offsetHeight;

	//document.getElementById('zoom-image').style.left = -450 + 'px';
	//document.getElementById('zoom-image').style.top = -800 + 'px';


	YAHOO.util.Event.addListener("up-arrow", "click", moveDown);
	YAHOO.util.Event.addListener("down-arrow", "click", moveUp);

	//zoom onload vars
	var oUpArrow = document.getElementById("up-arrow");
	var oDownArrow = document.getElementById("down-arrow");

	countsImages ('thumbnails-mask');
	document.getElementById('medium-image').onclick=showBig;
	//document.getElementById('large-image').onmouseover=clearIntrv;

	//document.getElementById('large-image').onmouseout=hideBig;

	//document.getElementById('large-image').onclick=showBig;
	bigWidth = document.getElementById('zoom-image').offsetWidth ;
	bigHeight = document.getElementById('zoom-image').offsetHeight ;

	//Set the height and width of the box which shows where you are
	//zooming on the original normal sized product image. This box
	//should be same size in relation to the normal product image
	//as the zoom-box is to the extra large sized product image.
	zoomWindowBoxWidth = (zoomRatio * bigBoxWidth);
	zoomWindowBoxHeight = (zoomRatio * bigBoxHeight);
	document.getElementById('zoomWindowBox').style.width = zoomWindowBoxWidth + 'px';
	document.getElementById('zoomWindowBox').style.height = zoomWindowBoxHeight + 'px';
}


function setMouseCoords(e)
{
	var ie = document.all?true:false;
	if (!e) {
		   e = window.event;
	}

	if (e.pageX || e.pageY) {
		   mouseX = e.pageX;
		   mouseY = e.pageY;

	} else if (e.clientX || e.clientY) {

	   mouseX = YAHOO.util.Event.getPageX(e);
	   mouseY = YAHOO.util.Event.getPageY(e);
	}
}


/* 左则 拉动*/
function countElements(container_id, tag)
{
	var container = document.getElementById(container_id);
	var elem_count = container.getElementsByTagName(tag).length;
	return elem_count;
}

/* 左则 拉动*/
function countsImages (element_id)
{
	images = document.getElementById(element_id).getElementsByTagName('img');
if(images.length<5){
return ;
}
	imgAmount = (images.length -1);
	idcc = (images.length -1);
	//var images2 = document.getElementById('thumbnails-loop').getElementsByTagName('img');
	scrollBorder = (sHeight * 3 ) - (sHeight*images.length);

	for(var d=0;d<images.length;d++)
	{
		thumbsPos.push(sHeight*(d-1));

		thumbsPosDown.unshift(sHeight*(d-1));

		document.getElementById(images[d].id).style.top = thumbsPos[d]+'px';
		YAHOO.util.Event.addListener(images[d].id, "click", moveUp);
		//YAHOO.util.Event.addListener(images2[d].id, "click", moveUp);
	}
	moveDown(images[0].id);
}




////////////////////////////////////////////////////////////////////////


//show zoom image
function showBig()
{
	largeImageShown = true;

    // Hide the video if it's on
    if (isVideoOn) {
        hideVideo();
    }

    clearIntrv();
    setVisibilityById('demo', false);
    setVisibilityById('sizing', false);
    setVisibilityById('designer', false);
    setVisibilityById('zoom-image', true);
    setVisibilityById('zoom-box', true);
    setVisibilityById('zoomWindowBox', true);

	zoomInterval = setInterval("animateBigImage()", 10);

    isZoomOn = true;
}

/*
 * Removes the zoom & hides the image zoom's containing elements
 */
function removeZoom()
{
    clearInterval(zoomInterval);
    setVisibilityById('zoom-image', false);
    setVisibilityById('zoom-box', false);
    isZoomOn = false;
}


function clearIntrv()
{
	clearTimeout(hideInterval);
}

function hideBig()
{
	hideInterval = setTimeout("hideDelay()", 250);
}

function hideDelay()
{
	if (isZoomOn) {

        if (!isVideoOn) {
            setVisibilityById('demo', true);
            setVisibilityById('sizing', true);
            setVisibilityById('designer', true);
            setVisibilityById('zoom-image', false);
            setVisibilityById('zoom-box', false);
            setVisibilityById('zoomWindowBox', false);
            clearInterval (zoomInterval);
        }

        isZoomOn = false;
	}
}

function hideBigBox()
{
	setVisibilityById('zoom-image', false);
}

//zoom function
function animateBigImage()
{
	var xPos =  mouseX;
	var yPos =  mouseY;
	var bigXPos = YAHOO.util.Dom.getX('zoom-image');
	var bigYPos = YAHOO.util.Dom.getY('zoom-image');

	//X and Y coordinates of the normal sized product image
	//from the page corner
	var largeXOffset = YAHOO.util.Dom.getX('medium-image');
	var largeYOffset = YAHOO.util.Dom.getY('medium-image');

    var mediumImageWidth = document.getElementById('medium-image').offsetWidth;
    var mediumImageHeight = document.getElementById('medium-image').offsetHeight;

    /*
     * Work out if the cursor is within some custom bounds of the product image. If it is, then
     * stop animating.
     */
	 /*
    if(xPos < (largeXOffset - productImageMarginSides) ||
       xPos > (largeXOffset + mediumImageWidth + productImageMarginSides) ||
       yPos < (largeYOffset - productImageMarginTop) ||
       yPos > (largeYOffset + mediumImageHeight + productImageMarginBottom))
    {
        hideBig();
        return;
    }

	if(xPos < (largeXOffset+zoomWindowBoxWidth/2)  ||
       xPos > (largeXOffset + mediumImageWidth-zoomWindowBoxWidth/2) ||
       yPos < (largeYOffset+zoomWindowBoxHeight/2)  ||
       yPos > (largeYOffset + mediumImageHeight-zoomWindowBoxHeight/2 ))
	*/	

	if(xPos < (largeXOffset)  ||
       xPos > (largeXOffset + mediumImageWidth) ||
       yPos < (largeYOffset)  ||
       yPos > (largeYOffset + mediumImageHeight ))

	
    {
        hideBig();
        return;
    }

	//var bigXPos = document.getElementById('zoom-image').offsetLeft;
	//var bigYPos = document.getElementById('zoom-image').offsetTop;

	factorX = (bigWidth- bigBoxWidth)/smallWidth;
	factorY = (bigHeight-bigBoxHeight)/smallHeight ;

	var targetX = 0 - (factorX * (xPos-largeXOffset));
	var targetY = 0 - (factorY * (yPos-largeYOffset));

	targetX = Math.round(targetX);
	targetY = Math.round(targetY);

	bigX +=  ((targetX-bigX)*easing);
	bigY +=  ((targetY-bigY)*easing);

	bigY = Math.round(bigY);
	bigX = Math.round(bigX);

	
 	//var move = new YAHOO.util.Anim('bImg', {top: { to: bigY }, left:{to:bigX}}, 1 ,YAHOO.util.Easing.easeOut);

	//X and Y coordinates of the zoom box from the page corner
	var bigBoxXOffset = YAHOO.util.Dom.getX('zoom-box');
	var bigBoxYOffset = YAHOO.util.Dom.getY('zoom-box');

	//X and Y coordinates of the extra large product image from the page corner
	var zoomImageXOffset = YAHOO.util.Dom.getX('zoom-image');
	var zoomImageYOffset = YAHOO.util.Dom.getY('zoom-image');

	//Work out where zoom-box is in relation to the extra large zoom image.
	//Apply the zoom ratio to work out where our small box which shows where
	//you are zooming should be located in relation to the normal sized product image
	var windowBoxXOffset = (bigBoxXOffset - zoomImageXOffset) * zoomRatio;
	var windowBoxYOffset = (bigBoxYOffset - zoomImageYOffset) * zoomRatio;

	//Add the X and Y coordinates  of the normal sized image to get the X and Y
	//coordinates for the small box in relation to the page corner.
	windowBoxXOffset += largeXOffset;
	windowBoxYOffset += largeYOffset;

	//Make sure our X and Y coordinates are integers.
	windowBoxXOffset = Math.round(windowBoxXOffset);
	windowBoxYOffset = Math.round(windowBoxYOffset);

	factorX = (bigWidth- bigBoxWidth)/smallWidth;
	factorY = (bigHeight-bigBoxHeight)/smallHeight ;

	var targetX = 0 - (factorX * (xPos-largeXOffset));
	var targetY = 0 - (factorY * (yPos-largeYOffset));

	targetX = Math.round(targetX);
	targetY = Math.round(targetY);

	bigX +=  ((targetX-bigX)*zoomRatio);
	bigY +=  ((targetY-bigY)*zoomRatio);
	
	bigX = Math.round(bigX)+zoomWindowBoxWidth/2+10;
	bigY = Math.round(bigY)+zoomWindowBoxHeight/2+10;


					if((zoomWindowBoxWidth/2+xPos)>(mediumImageWidth+largeXOffset)){
					xpos2=mediumImageWidth+largeXOffset-zoomWindowBoxWidth;
					bigX=-(bigWidth-(mediumImageWidth-zoomWindowBoxWidth)/zoomRatio+100);
					}else if((xPos-zoomWindowBoxWidth/2)<largeXOffset){
					xpos2 = largeXOffset ;
					bigX=0;
					}else{
					xpos2 = xPos - zoomWindowBoxWidth/2 ;
					}
					
					//alert (bigX);
					//alert (bigXPos);

					if((zoomWindowBoxHeight/2+yPos)>(mediumImageHeight+largeYOffset)){
					ypos2 = mediumImageHeight+largeYOffset-zoomWindowBoxHeight;
					
					}else if((yPos-zoomWindowBoxHeight/2)<largeYOffset){
					ypos2 = largeYOffset ;
					bigY=0;
					}else{
					ypos2 = yPos - zoomWindowBoxHeight/2 ;
					}

	//bigX=-(bigWidth-zoomWindowBoxWidth/zoomRatio);
	//alert (bigX);
	//bigX=-(bigWidth-zoomWindowBoxWidth/zoomRatio);

	document.getElementById("zoom-image").style.left  = bigX+ 'px';
	document.getElementById("zoom-image").style.top = bigY + 'px';


                  //  xpos = (mouse.x - $("div.jqZoomPup").width()/2 < imageLeft ) ? 0 : (mouse.x + $("div.jqZoomPup").width()/2 > imageWidth + imageLeft ) ?  (imageWidth -$("div.jqZoomPup").width() -2)  : xpos;

					//ypos = (mouse.y - $("div.jqZoomPup").height()/2 < imageTop ) ? 0 : (mouse.y + $("div.jqZoomPup").height()/2  > imageHeight + imageTop ) ?  (imageHeight - $("div.jqZoomPup").height() -2 ) : ypos;


	//Set the coordinates for the small box which shows where
	//you are zooming
	document.getElementById('zoomWindowBox').style.left  = xpos2 + 'px';
	document.getElementById('zoomWindowBox').style.top  = ypos2  + 'px';
}



function moveDown(e)
{
	if(images.length<5) return ;
	if (idc>0) {
		idc--;
	} else {
		idc=images.length-1;
	}
	var tempPoss = thumbsPos.shift();
	thumbsPos.push(tempPoss);
	document.getElementById(images[idc].id).style.top = -92+'px';

	for(var d=0;d<images.length;d++)
	{
		var moves = new YAHOO.util.Anim(images[d].id, {top: {to: thumbsPos[d]}} ,  0.6 ,YAHOO.util.Easing.easeOutStrong);
		moves.animate();
	}
}

//move thumbnails up
function moveUp(e)
{	
	if(images.length<5) return ;
	if(document.getElementById(images[idc].id).offsetTop<92)
	{
		document.getElementById(images[idc].id).style.top = 368+'px';
	}
	if(idc<imgAmount)
	{
		idc++;
	}
	else
	{
		idc=0;
	}

	var tempPos = thumbsPos.pop();
	thumbsPos.unshift(tempPos);

	for(var d=0;d<images.length;d++)
	{
		var move = new YAHOO.util.Anim(images[d].id, {top: {to: thumbsPos[d]}} ,  0.6 ,YAHOO.util.Easing.easeOutStrong);
		move.animate();
	}

}

function setVisibilityById(id, visibility) {
    if (document.getElementById(id) != null) {
        if (visibility) {
            document.getElementById(id).style.visibility = 'visible';
        } else {
            document.getElementById(id).style.visibility = 'hidden';
        }
    }
}





var Transport =
{
  /* *
  * 存储本对象所在的文件名。
  *
  * @static
  */
  filename : "transport.js",

  /* *
  * 存储是否进入调试模式的开关，打印调试消息的方式，换行符，调试用的容器的ID。
  *
  * @private
  */
  debugging :
  {
    isDebugging : 0,
    debuggingMode : 0,
    linefeed : "",
    containerId : 0
  },

  /* *
  * 设置调试模式以及打印调试消息方式的方法。
  *
  * @public
  * @param   {int}   是否打开调试模式      0：关闭，1：打开
  * @param   {int}   打印调试消息的方式    0：alert，1：innerHTML
  *
  */
  debug : function (isDebugging, debuggingMode)
  {
    this.debugging =
    {
      "isDebugging" : isDebugging,
      "debuggingMode" : debuggingMode,
      "linefeed" : debuggingMode ? "<br />" : "\n",
      "containerId" : "dubugging-container" + new Date().getTime()
    };
  },

  /* *
  * 传输完毕后自动调用的方法，优先级比用户从run()方法中传入的回调函数高。
  *
  * @public
  */
  onComplete : function ()
  {
  },

  /* *
  * 传输过程中自动调用的方法。
  *
  * @public
  */
  onRunning : function ()
  {
  },

  /* *
  * 调用此方法发送HTTP请求。
  *
  * @public
  * @param   {string}    url             请求的URL地址
  * @param   {mix}       params          发送参数
  * @param   {Function}  callback        回调函数
  * @param   {string}    ransferMode     请求的方式，有"GET"和"POST"两种
  * @param   {string}    responseType    响应类型，有"JSON"、"XML"和"TEXT"三种
  * @param   {boolean}   asyn            是否异步请求的方式
  * @param   {boolean}   quiet           是否安静模式请求
  */
  run : function (url, params, callback, transferMode, responseType, asyn, quiet)
  {
    /* 处理用户在调用该方法时输入的参数 */
    params = this.parseParams(params);
    transferMode = typeof(transferMode) === "string"
    && transferMode.toUpperCase() === "GET"
    ? "GET"
    : "POST";
	
    if (transferMode === "GET")
    {
      var d = new Date();

      url += params ? (url.indexOf("?") === - 1 ? "?" : "&") + params : "";
      url = encodeURI(url) + (url.indexOf("?") === - 1 ? "?" : "&") + d.getTime() + d.getMilliseconds();
      params = null;
    }

    responseType = typeof(responseType) === "string" && ((responseType = responseType.toUpperCase()) === "JSON" || responseType === "XML") ? responseType : "TEXT";
    asyn = asyn === false ? false : true;

    /* 处理HTTP请求和响应 */
    var xhr = this.createXMLHttpRequest();
    try
    {
      var self = this;
	 
	  /**/
      if (typeof(self.onRunning) === "function" && !quiet)
      {
        self.onRunning();
      }
       //alert(url);
      xhr.open(transferMode, url, asyn);
      
      if (transferMode === "POST")
      {
        xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
      }
		
      if (asyn)
      {
        xhr.onreadystatechange = function (){
           
          if (xhr.readyState == 4){
            switch ( xhr.status ){
              case 0:
              case 200: // OK!
                if (typeof(self.onComplete) === "function"){
                  	self.onComplete();
                }

                if (typeof(callback) === "function"){
                  	callback.call(self, self.parseResult(responseType, xhr), xhr.responseText);
                }
              	break;
              case 304: // Not Modified
              	break;
              case 400: // Bad Request
                 alert("XmlHttpRequest status: [400] Bad Request");
              	break;
              case 404: // Not Found
                alert("XmlHttpRequest status: [404] \nThe requested URL "+url+" was not found on this server.");
              	break;
              case 409: // Conflict
              	break;
              case 503: // Service Unavailable
                 alert("XmlHttpRequest status: [503] Service Unavailable");
              	break;
              default:
                 alert("XmlHttpRequest status: [" + xhr.status + "] Unknow status.");
            }
            xhr = null;
          }
        }
        if (xhr != null) xhr.send(params);
      }
      else
      {
      	/**/
        if (typeof(self.onRunning) === "function")
        {
          self.onRunning();
        }
        xhr.send(params);
        
        var result = self.parseResult(responseType, xhr);
        //xhr = null;
        if (typeof(self.onComplete) === "function")
        {
          self.onComplete();
        }
        if (typeof(callback) === "function")
        {
          callback.call(self, result, xhr.responseText);
        }

        return result;
      }
    }
    catch (ex)
    {
      if (typeof(self.onComplete) === "function")
      {
        self.onComplete();
      }

      alert(this.filename + "/run() error:" + ex.description);
    }
  },

  /* *
  * 如果开启了调试模式，该方法会打印出相应的信息。
  *
  * @private
  * @param   {string}    info    调试信息
  * @param   {string}    type    信息类型
  */
  displayDebuggingInfo : function (info, type)
  {
    if ( ! this.debugging.debuggingMode)
    {
      alert(info);
    }
    else
    {

      var id = this.debugging.containerId;
      if ( ! document.getElementById(id))
      {
        div = document.createElement("DIV");
        div.id = id;
        div.style.position = "absolute";
        div.style.width = "98%";
        div.style.border = "1px solid #f00";
        div.style.backgroundColor = "#eef";
        var pageYOffset = document.body.scrollTop
        || window.pageYOffset
        || 0;
        div.style.top = document.body.clientHeight * 0.6
        + pageYOffset
        + "px";
        document.body.appendChild(div);
        div.innerHTML = "<div></div>"
        + "<hr style='height:1px;border:1px dashed red;'>"
        + "<div></div>";
      }

      var subDivs = div.getElementsByTagName("DIV");
      if (type === "param")
      {
        subDivs[0].innerHTML = info;
      }
      else
      {
        subDivs[1].innerHTML = info;
      }
    }
  },

  /* *
  * 创建XMLHttpRequest对象的方法。
  *
  * @private
  * @return      返回一个XMLHttpRequest对象
  * @type    Object
  */
  createXMLHttpRequest : function ()
  {
    var xhr = null;

    if (window.ActiveXObject)
    {
      var versions = ['Microsoft.XMLHTTP', 'MSXML6.XMLHTTP', 'MSXML5.XMLHTTP', 'MSXML4.XMLHTTP', 'MSXML3.XMLHTTP', 'MSXML2.XMLHTTP', 'MSXML.XMLHTTP'];

      for (var i = 0; i < versions.length; i ++ )
      {
        try
        {
          xhr = new ActiveXObject(versions[i]);
          break;
        }
        catch (ex)
        {
          continue;
        }
      }
    }
    else
    {
      xhr = new XMLHttpRequest();
    }

    return xhr;
  },

  /* *
  * 当传输过程发生错误时将调用此方法。
  *
  * @private
  * @param   {Object}    xhr     XMLHttpRequest对象
  * @param   {String}    url     HTTP请求的地址
  */
  onXMLHttpRequestError : function (xhr, url)
  {
    throw "URL: " + url + "\n"
    +  "readyState: " + xhr.readyState + "\n"
    + "state: " + xhr.status + "\n"
    + "headers: " + xhr.getAllResponseHeaders();
  },

  /* *
  * 对将要发送的参数进行格式化。
  *
  * @private
  * @params {mix}    params      将要发送的参数
  * @return 返回合法的参数
  * @type string
  */
  parseParams : function (params)
  {
    var legalParams = "";
    params = params ? params : "";

    if (typeof(params) === "string")
    {
      legalParams = params;
    }
    else if (typeof(params) === "object")
    {
      try
      {
        legalParams = "JSON=" + params.toJSONString();
      }
      catch (ex)
      {
        alert("Can't stringify JSON!");
        return false;
      }
    }
    else
    {
      alert("Invalid parameters!");
      return false;
    }

    if (this.debugging.isDebugging)
    {
      var lf = this.debugging.linefeed,
      info = "[Original Parameters]" + lf + params + lf + lf
      + "[Parsed Parameters]" + lf + legalParams;

      this.displayDebuggingInfo(info, "param");
    }
    return legalParams;
  },

  /* *
  * 对返回的HTTP响应结果进行过滤。
  *
  * @public
  * @params   {mix}   result   HTTP响应结果
  * @return  返回过滤后的结果
  * @type string
  */
  preFilter : function (result)
  {
    return result.replace(/\xEF\xBB\xBF/g, "");
  },

  /* *
  * 对返回的结果进行格式化。
  *
  * @private
  * @return 返回特定格式的数据结果
  * @type mix
  */
  parseResult : function (responseType, xhr)
  {
    var result = null;
    switch (responseType)
    {
      case "JSON" :
      	
        result = this.preFilter(xhr.responseText);
        
        try
        {
          result = result.parseJSON();
        }
        catch (ex)
        {
          throw this.filename + "/parseResult() error: can't parse to JSON.\n\n" + xhr.responseText;
        }
        break;
      case "XML" :
        result = xhr.responseXML;
        break;
      case "TEXT" :
        result = this.preFilter(xhr.responseText);
        break;
      default :
        throw this.filename + "/parseResult() error: unknown response type:" + responseType;
    }
    
    if (this.debugging.isDebugging)
    {
      var lf = this.debugging.linefeed,
      info = "[Response Result of " + responseType + " Format]" + lf
      + result;

      if (responseType === "JSON")
      {
        info = "[Response Result of TEXT Format]" + lf
        + xhr.responseText + lf + lf
        + info;
      }

      this.displayDebuggingInfo(info, "result");
    }

    return result;
  }
};

/* 定义两个别名 */
var Ajax = Transport;
Ajax.call = Transport.run;
